Todo.View.Category = Backbone.View.extend({

    //... is a list tag.
    tagName: "li",

    className: "category",

    // Cache the template function for a single item.
    template : _.template($('#category-template').html()),

    // The DOM events specific to an item.
    events   : {
        /*
         "click .toggle"  : "toggleDone",
         "dblclick .view" : "edit",
         "click a.destroy": "clear",
         "keypress .edit" : "updateOnEnter",
         "blur .edit"     : "close"
         */
    },

    initialize: function () {
        this.model.on('change', this.render, this);
        this.model.on('updateItems', this.render, this);
        /*
         this.model.on('destroy', this.remove, this);
         */
    },

    render: function () {
        this.$el.data(this.model.toJSON());

        if (this.model.get('id') == 0) {
            this.$el.addClass('main');
        }

        this.$el.html(
            this.template(this.model.toJSON())
        );

        var t = this,
            items = t.model.get('items');

        _.each(['due', 'date', 'other'], function (type) {
            var filteredItems = items.getByType(type);
            t.itemsType = type;

            if (filteredItems.length) {
                var c = [];

                filteredItems.each(function (item) {
                    c.push({
                        item  : item,
                        parent: t.$('ul.' + type)
                    });
                });

                _.each(c, t.renderItem);
            }
        });

        return this;
    },

    renderItem: function (obj) {
        if (Todo.debug) {
            console.log('Todo.View.Category::renderItem');
        }

        var item = obj.item;

        var view = new Todo.View.Item({
            model: item
        });

        obj.parent.append(view.render().el);

        return this;
    }
});